<style>
    input{
    outline:none;
}
    .menu{
    width: 100%;
    height: 50px;
    position:absolute;
    top:208px;
    background-color: #fff;
    z-index: 998;
}
.menu ul{
    height: 50px;
    width: 930px;
    float: left;
    margin-left: 50px;
}
.menu ul li{
    width: 100px;
    height: 50px;
    line-height: 50px;
    float: left;
}
.menu ul li a{
    font-size: 24px;
    font-weight: 900;
    color: #000;
}
.menu ul li a:hover{
    text-decoration: underline;
}
.menu ul li .menu-detail{
    width: 100%;
    height: 0px;
    overflow: hidden;
    background-color: #fff;
    position: absolute;
    top: 50px;
    left: 0;
    transition: height  300ms;

}
.menu ul li a:hover~.menu-detail{
    height: 300px;
    border-bottom: 3px solid black;
}
.menu ul li .menu-detail:hover{
    height: 300px;
    border-bottom: 3px solid black;
}
.menu ul li .menu-detail .list{
    width: 100px;
    height: 300px;
    float: left;
    margin-left: 80px;
}
.menu ul li .menu-detail .list a {
    font-size: 12px;
    display: block;
    height: 20px;
    line-height: 20px;
    text-align: center;
    margin-top: 15px;
    font-weight: 800;
}
.menu ul li .menu-detail .list a:first-child{
    font-size: 16px;
    margin-top: 30px;
}


.menu .search{
    width: 180px;
    height: 25px;
    float: right;
    margin-top:15px;
    margin-right: 40px;
    border-bottom: #333 1px solid;
    background: url(../images/css_sprites.png) -252px -10px;
}
.menu .search input{
    height: 25px;
    width: 155px;
    border: none;
}
.shopcart{
    position:fixed;
    width: 50px;
    height: 50px;
    bottom: 102px;
    right: 50px;
    z-index: 999;
    border: 2px solid black;
}
.shopcart img{
    width: 30px;
    height: 30px;
    margin: 10px;
}
.top{
    position:fixed;
    width: 24px;
    height: 24px;
    bottom: 50px;
    right: 50px;
    z-index: 999;
    border: 2px solid black;
    font-size: 12px;
    line-height: 15px;
    padding: 13px;
    color: black;
    background: url(../../images/top.png) no-repeat;
    background-size: 20px 15px;
    background-position: center top;
}
</style>
<div class="menu">
    <ul>
        <li><a href="../../index.html">首页</a></li>
        <li><a href="#" class="menu-a">女鞋</a><div class="menu-detail">
            <div class="list">
                <a href="">品牌</a>
                <a href="">百丽</a>
                <a href="">森达</a>
                <a href="">妙丽</a>
                <a href="">暇步士</a>
                <a href="">百思图</a>
                <a href="">真美诗</a>
            </div>
            <div class="list">
                <a href="">热销推荐</a>
                <a href="">2020新款推荐</a>
                <a href="">专柜同款</a>
                <a href="">人气top</a>
                <a href="">老爹鞋</a>
                <a href="">乐福鞋</a>
                <a href="">小白鞋</a>
            </div>
            <div class="list">
                <a href="">精选分类</a>
                <a href="">正常鞋</a>
                <a href="">休闲鞋</a>
                <a href="">运动鞋</a>
                <a href="">布洛克</a>
                <a href="">懒人鞋</a>
                <a href="">冬靴</a>
            </div>
            <div class="list">
                <a href="">关键词</a>
                <a href="">速干</a>
                <a href="">热销top</a>
                <a href="">工装</a>
                <a href="">复刻</a>
                <a href="">篮球</a>
                <a href="">跑步</a>
            </div>
        </div></li>
        <li><a href="#" class="menu-a">男鞋</a><div class="menu-detail"><div class="list">
            <a href="">品牌</a>
            <a href="">百丽</a>
            <a href="">森达</a>
            <a href="">妙丽</a>
            <a href="">暇步士</a>
            <a href="">百思图</a>
            <a href="">真美诗</a>
        </div>
        
        <div class="list">
            <a href="">精选分类</a>
            <a href="">正常鞋</a>
            <a href="">休闲鞋</a>
            <a href="">运动鞋</a>
            <a href="">布洛克</a>
            <a href="">懒人鞋</a>
            <a href="">冬靴</a>
        </div>
        <div class="list">
            <a href="">热销推荐</a>
            <a href="">2020新款推荐</a>
            <a href="">专柜同款</a>
            <a href="">人气top</a>
            <a href="">老爹鞋</a>
            <a href="">乐福鞋</a>
            <a href="">小白鞋</a>
        </div>
        <div class="list">
            <a href="">关键词</a>
            <a href="">速干</a>
            <a href="">热销top</a>
            <a href="">工装</a>
            <a href="">复刻</a>
            <a href="">篮球</a>
            <a href="">跑步</a>
        </div></div></li>
        <li><a href="#" class="menu-a">运动</a><div class="menu-detail">
        
        <div class="list">
            <a href="">热销推荐</a>
            <a href="">2020新款推荐</a>
            <a href="">专柜同款</a>
            <a href="">人气top</a>
            <a href="">老爹鞋</a>
            <a href="">乐福鞋</a>
            <a href="">小白鞋</a>
        </div>
        <div class="list">
            <a href="">精选分类</a>
            <a href="">正常鞋</a>
            <a href="">休闲鞋</a>
            <a href="">运动鞋</a>
            <a href="">布洛克</a>
            <a href="">懒人鞋</a>
            <a href="">冬靴</a>
        </div>
        <div class="list">
            <a href="">品牌</a>
            <a href="">百丽</a>
            <a href="">森达</a>
            <a href="">妙丽</a>
            <a href="">暇步士</a>
            <a href="">百思图</a>
            <a href="">真美诗</a>
        </div>
        <div class="list">
            <a href="">关键词</a>
            <a href="">速干</a>
            <a href="">热销top</a>
            <a href="">工装</a>
            <a href="">复刻</a>
            <a href="">篮球</a>
            <a href="">跑步</a>
        </div></div></li>
        <li><a href="#" class="menu-a">户外</a><div class="menu-detail">
            <div class="list">
                <a href="">关键词</a>
                <a href="">速干</a>
                <a href="">热销top</a>
                <a href="">工装</a>
                <a href="">复刻</a>
                <a href="">篮球</a>
                <a href="">跑步</a>
            </div>
        <div class="list">
            <a href="">品牌</a>
            <a href="">百丽</a>
            <a href="">森达</a>
            <a href="">妙丽</a>
            <a href="">暇步士</a>
            <a href="">百思图</a>
            <a href="">真美诗</a>
        </div>
        <div class="list">
            <a href="">热销推荐</a>
            <a href="">2020新款推荐</a>
            <a href="">专柜同款</a>
            <a href="">人气top</a>
            <a href="">老爹鞋</a>
            <a href="">乐福鞋</a>
            <a href="">小白鞋</a>
        </div>
        <div class="list">
            <a href="">精选分类</a>
            <a href="">正常鞋</a>
            <a href="">休闲鞋</a>
            <a href="">运动鞋</a>
            <a href="">布洛克</a>
            <a href="">懒人鞋</a>
            <a href="">冬靴</a>
        </div>
        </div></li>
        <li><a href="#" class="menu-a">儿童</a><div class="menu-detail"><div class="list">
            <a href="">品牌</a>
            <a href="">百丽</a>
            <a href="">森达</a>
            <a href="">妙丽</a>
            <a href="">暇步士</a>
            <a href="">百思图</a>
            <a href="">真美诗</a>
        </div>
        <div class="list">
            <a href="">热销推荐</a>
            <a href="">2020新款推荐</a>
            <a href="">专柜同款</a>
            <a href="">人气top</a>
            <a href="">老爹鞋</a>
            <a href="">乐福鞋</a>
            <a href="">小白鞋</a>
        </div>
        <div class="list">
            <a href="">精选分类</a>
            <a href="">正常鞋</a>
            <a href="">休闲鞋</a>
            <a href="">运动鞋</a>
            <a href="">布洛克</a>
            <a href="">懒人鞋</a>
            <a href="">冬靴</a>
        </div>
        <div class="list">
            <a href="">关键词</a>
            <a href="">速干</a>
            <a href="">热销top</a>
            <a href="">工装</a>
            <a href="">复刻</a>
            <a href="">篮球</a>
            <a href="">跑步</a>
        </div></div></li>
        <li><a href="#" class="menu-a">包箱</a><div class="menu-detail"><div class="list">
            <a href="">品牌</a>
            <a href="">百丽</a>
            <a href="">森达</a>
            <a href="">妙丽</a>
            <a href="">暇步士</a>
            <a href="">百思图</a>
            <a href="">真美诗</a>
        </div>
        <div class="list">
            <a href="">热销推荐</a>
            <a href="">2020新款推荐</a>
            <a href="">专柜同款</a>
            <a href="">人气top</a>
            <a href="">老爹鞋</a>
            <a href="">乐福鞋</a>
            <a href="">小白鞋</a>
        </div>
        
        <div class="list">
            <a href="">关键词</a>
            <a href="">速干</a>
            <a href="">热销top</a>
            <a href="">工装</a>
            <a href="">复刻</a>
            <a href="">篮球</a>
            <a href="">跑步</a>
        </div>
        <div class="list">
            <a href="">精选分类</a>
            <a href="">正常鞋</a>
            <a href="">休闲鞋</a>
            <a href="">运动鞋</a>
            <a href="">布洛克</a>
            <a href="">懒人鞋</a>
            <a href="">冬靴</a>
        </div></div></li>
    </ul>
    <div class="search"><input type="text"></div>
</div>
<a href="javascript:scrollTo(0,0)"><div class="top">返回顶部</div></a>
<a href="../html/cart.html"><div class="shopcart"><img src="../../images/cart.png" alt=""></div></a>

<script>
    require(['config'], function() {
        require(['jquery'], function() {
            $('.list a').click((e)=>{
                let x=$(e.target).html()
                let html ='../html/list.html?page=1&&address='+x
                console.log(html)
                window.location.href=html
                return false;
            })

            $('.menu-a').click((e)=>{
                let x=$(e.target).html()
                let html ='../html/list.html?page=1&&address='+x
                console.log(html)
                window.location.href=html
                return false;
            })
        })
    })
    
</script>